import { React, Component, useEffect, useState } from "react";

import { getBaseData,login } from './../api/api'



import { Button, Space, NavBar, TabBar, Form, Input, Dialog } from 'antd-mobile'

import { Route } from 'react-router-dom'



export default () => {

    const [news, setNews] = useState([
        { id: 1, title: '标题1' },
        { id: 2, title: '标题2' }
    ])
    const addList = () => {
        const _news = { id: 3, title: '标题3' }
        setNews([...news, _news])
    }

    /** 提交 */
    const onFinish = (values) => {
        login(values).then((res)=>{
           console.log(res)     
        })
    }

    return (
        <div>


            <h1>我是首页模板</h1>

            <Form layout='horizontal' onFinish={onFinish} footer={
                <Button block type='submit' color='primary' size='large'>
                    提交
                </Button>
            }>
                <Form.Item
                    name='account'
                    label='账号'
                    rules={[{ required: true, message: '姓名不能为空' }]}
                >
                    <Input onChange={console.log} placeholder='请输入姓名' />
                </Form.Item>
                <Form.Item
                    name='password'
                    label='密码'
                
                    rules={[{ required: true, message: '姓名不能为空' }]}
                >
                    <Input onChange={console.log} placeholder='请输入姓名'     type='password' />
                </Form.Item>
            </Form>


            <ul>

                {news.map((item, index) => (
                    <li key={index}>{item.title}</li>
                ))}
            </ul>
            <Button onClick={addList}>添加</Button>
        </div>
    )
}






